- Published on
Vuepress2 + Vercel Cli 搭建博客 2022
node --version
v16.19.1
直接使用了reco主题的cli安装。
http://v2.vuepress-reco.recoluan.com/docs/guide/getting-started.html
npm install @vuepress-reco/theme-cli@1.0.7 -g
# 初始化,并选择 2.x
theme-cli init
npm install
然后是主题配置
http://v2.vuepress-reco.recoluan.com/docs/theme/introduce.html
npm install vuepress@next vuepress-theme-reco@next --save-dev
修改代码,将footer的 vuepress-theme-reco@2.0.0-beta.41 去掉,文件路径如下:
项目/node_modules/vuepress-theme-reco/lib/client/components/Home/Footer.vue
<span>
<!-- <Xicons-->
<!-- icon="Palette"-->
<!-- link="http://v2.vuepress-reco.recoluan.com"-->
<!-- target="_blank"-->
<!-- :text="`vuepress-theme-reco@${version}`"-->
<!-- />-->
Ray Wei's Blog
</span>
https://lucas-yang.vercel.app/
https://github.com/ycs77/star-note-lucas-vuepress
https://pengzhanbo.cn/note/vuepress-theme-plume/write-article/
https://www.npmjs.com/package/@vuepress-plume/vuepress-theme-plume
https://www.npmjs.com/package/vuepress-theme-book
https://vuepress-theme-book.netlify.app/
https://www.npmjs.com/package/vuepress-theme-hope
https://vuepress-theme-hope.github.io/v2/
https://xxyan0205.github.io/vuepress-theme-quicksand/
https://github.com/xxyan0205/vuepress-theme-quicksand#readme
vercel-cli
vercel-cli,在本地直接打包上传至 vercel
安装
npm i -g vercel
or
yarn global add vercel
安装成功后,初始化 vercel
vercel
依提示键入注册 vercel 使用的邮箱 3. 从邮箱激活账户 激活后,命令行会提示如下
√ Email confirmed Congratulations! You are now logged in. In order to deploy something, run
vercel. 💡 Connect your Git Repositories to deploy every branch push automatically (https://vercel.link/git).
- 初始化项目
vercel deploy
依据提示关联或新建一个项目,当询问
In which directory is your code located
直接跳过即可。
之后,会生成1个网站地址,暂时忽略。
此时就可以在根路径看到 .vercel 的文件夹了,反过来说如果不存在该文件夹,则失败了。
- 新建
deploy.sh文件 键入
#!/usr/bin/env sh
set -e
# 生成静态文件
npm run docs:build
cp -rvf .vercel docs/.vuepress/dist
# 进入生成的文件夹
cd docs/.vuepress/dist
vercel --prod
cd -
- 在命令行键入
./deploy.sh测试 一键打包成功后,即可看到正常的页面。 - 其他命令
./pushToGit.sh
#!/usr/bin/env sh
# 确保脚本抛出遇到的错误
#set -e
time=$(date "+%Y-%m-%d %H:%M:%S")
#当未配置远端时,将下方的 # 移除
#git remote set-url origin https://gitee.com/sickeeer/blog-resource.git
git add -A
git commit -m "$time"
git push -u origin master
至此,我们就可以优雅的将源码提交至代码库,而 build 的文件直接上传至 vercel
再也不用忍受 github 的龟速,再也不用忍受 vercel 的龟速打包,再也不用苦逼的打包后上传静态文件!
优雅万岁!
https://110501.com/2021/03/23/how-to-use-vercel/
https://juejin.cn/post/6980134339434512421
https://vuepress-theme-hope.github.io/v2/
vuepress2遇到的问题
1.java代码中的范型会提示出错
2.md文件中的html代码会提示报错
https://blog.csdn.net/sinat_31213021/article/details/119449772